import { useEffect, useState } from "react";

const UseCounter = (initialCount = 0) => {
    const [count, setCount] = useState(initialCount);
    useEffect(() => {
        console.log(`count updated to ${count}`);
    }, [count]);
    return {
        count,
        increment: () => {setCount(count + 1)},
        decrement: () => {setCount(count - 1)},
        reset: () => {setCount(0)},
    }
}


const Demo = () => {
    const { count, increment, decrement, reset } = UseCounter(0);
    return (
        <div>
            <p>{count}</p>
            <button onClick={increment}>add</button>
            <button onClick={decrement}>minus</button>
            <button onClick={reset}>reset</button>
        </div>
    )
}

export default Demo;